<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>列表</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <link rel="shortcut icon" href="favicon.ico"> 
    <link href="${pageContext.request.contextPath }/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <!-- jqgrid-->
    <link href="${pageContext.request.contextPath }/css/plugins/jqgrid/ui.jqgrid.css?0820" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/animate.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/style.css?v=4.1.0" rel="stylesheet">
    <style>
        #alertmod_table_list_2 {
            top: 900px !important;
        }
    </style>
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content  animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox ">
                    <div class="ibox-content">
                    	<div id="mysearch" class="form-inline">
                    		<button class="btn btn-primary" onclick="addRole();">添加</button>
                    	</div>
                    	<br />
                        <div class="jqGrid_wrapper">
                            <table id="table_list_role"></table>
                            <div id="pager_list_2"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 全局js -->
    <script src="${pageContext.request.contextPath }/js/jquery.min.js?v=2.1.4"></script>
    <script src="${pageContext.request.contextPath }/js/bootstrap.min.js?v=3.3.6"></script>
    <!-- Peity -->
    <script src="${pageContext.request.contextPath }/js/plugins/peity/jquery.peity.min.js"></script>
    <!-- jqGrid -->
    <script src="${pageContext.request.contextPath }/js/plugins/jqgrid/i18n/grid.locale-cn.js?0820"></script>
    <script src="${pageContext.request.contextPath }/js/plugins/jqgrid/jquery.jqGrid.min.js?0820"></script>
    <!-- 自定义js -->
    <script src="${pageContext.request.contextPath }/js/content.js?v=1.0.0"></script>
    <script src="${pageContext.request.contextPath }/js/plugins/layer/layer.min.js"></script>
    <script>
        $(document).ready(function () {
            $.jgrid.defaults.styleUI = 'Bootstrap';
            $("#table_list_role").jqGrid({
            	url:"${pageContext.request.contextPath }/admin/role/getRoleList",
            	datatype:"json", //数据类型，json
            	mtype:"POST",//提交方式
                height: "auto",
                autowidth: true,//自动宽
                shrinkToFit: true,
                rowNum: 20,//每页显示记录数
                rowList: [10, 20, 30],//用于改变显示行数的下拉列表框的元素数组。
                colNames: ['名称','备注','操作员','操作'],
                colModel: [
                    {
                        name: 'AR_NAME',
                        index: 'AR_NAME',
                        search: false
                    },
                    {
                        name: 'AR_REMARK',
                        index: 'AR_REMARK',
                        editable: true
                    },
                    {
                    	name: 'operatorUser',
                        index: 'operatorUser',
                        editable: true
                    },
                    { 
                    	name: 'Edit',
                    	index: 'Edit', 
                    	sortable: false, 
                    	width: "150px",
                    	formatter: displaybuttons
                    }
                ],
                jsonReader:{
                	root:"list",
                    id: "AR_ID",//设置返回参数中，表格ID的名字为blackId
                    repeatitems : false
                },
                pager: "#pager_list_2",
                viewrecords: true,//是否在浏览导航栏显示记录总数
                caption: "角色列表",
                add: true,
                edit: true,
                addtext: 'Add',
                edittext: 'Edit',
                hidegrid: false
            });
            $("#table_list_role").jqGrid('navGrid', '#pager_list_2', {
            	refresh: true,
            	edit: false,
                add: false,
                del: false,
                search: false
            }, {
                reloadAfterSubmit: true
            });
            $(window).bind('resize', function () {
                var width = $('.jqGrid_wrapper').width();
                $('#table_list_role').setGridWidth(width);
            });
            // 删除 编辑
            function displaybuttons(cellvalue,options,rowObject){
            	var updateAuth = "<a title='查看权限' class='btn btn-zdy1 btn-sm m-t-sm m-r-sm' onclick='updateAuth("+options.rowId+")'><i class='fa fa-eye'></i>查看权限</a>";
            	var updateRole = "<a title='修改' class='btn btn-zdy1 btn-sm m-t-sm m-r-sm' onclick='updateRole("+options.rowId+")'><i class='fa fa-edit'></i>修改</a>";
        		var delRole = "<a title='删除' class='btn btn-zdy1 btn-sm m-t-sm m-r-sm' onclick='delRole("+options.rowId+")'><i class='fa fa-trash-o'></i>删除</a>";
        		return updateAuth+updateRole+delRole;
        	}
        });
        // 删除
        function delRole(rId){
        	layer.confirm('确认要删除吗？',function(index){
        		$.ajax({
        			async:false,
        			url:"${pageContext.request.contextPath }/admin/role/delete",
        			data:{'rId':rId},
        			type:'post',
        			success:function(result){
        				if(result==1){
        					layer.msg('删除成功!',{icon:1});
        					refresh();
        				}else if(result==0){
        					layer.msg('删除失败!',{icon:0});
        				}else if(result==2){
        					layer.msg('删除失败，当前角色尚有管理员存在!',{icon:0});
        				}else{
        					layer.msg('对不起!你没有权限!',{icon:0});
        				}
        			}
        		});
        	});
        }
        //编辑
        function updateRole(rId){
        	var url="${pageContext.request.contextPath }/admin/role/updatePage?rId="+rId;
        	var index=layer.open({
        		type: 2,
        		fix: false, //不固定
        		maxmin: true,
        		area: ['800px', '350px'],
        		shade:0.4,
        		title: "角色信息编辑",
        		content: url,
        		end:function(){refresh();}
        	});
        }
        //查看权限
        function updateAuth(rId){
        	var url="${pageContext.request.contextPath }/admin/role/authorityPage?rId="+rId;
        	var index=layer.open({
        		type: 2,
        		fix: false, //不固定
        		maxmin: true,
        		area: ['800px', '350px'],
        		shade:0.4,
        		title: "角色权限",
        		content: url,
        		end:function(){refresh();}
        	});
        }
        //添加
        function addRole(){
        	var url="${pageContext.request.contextPath }/admin/role/add";
        	var index=layer.open({
        		type: 2,
        		fix: false, //不固定
        		maxmin: true,
        		area: ['800px', '350px'],
        		shade:0.4,
        		title: "新增角色信息",
        		content: url,
        		end:function(){refresh();}
        	});
        }
        // 刷新
        function refresh(){
        	$("#table_list_role").jqGrid('setGridParam',
         		{ 
  	        		url: '${pageContext.request.contextPath }/admin/role/getRoleList',
  	        		postData: {sType:1}
          		}).trigger('reloadGrid'); 
        }
    </script>
</body>
</html>